<template>
  <div class="addHouse-view">
    <div class="addHouse-view-content">
      <el-tabs v-model="activeName2" type="card" @tab-click="handleClick" >
        <el-tab-pane label="用户管理" name="first" disabled>
          <div class="addHouse-user">
            <el-form
              :hide-required-asterisk="showRed"
              :model="ruleForm"
              ref="ruleForm"
              :rules="rules"
              label-width="100px"
              class="demo-ruleForm"
            >
              <div class="addHouse-user-input">
                <div class="addHouse-user-input-list">
                  <div class="user-input-title"><div class="user-input-sure">*</div>尊豪自营：</div>
                  <el-form-item  prop="selfSupport">
                    <div class="user-input">
                      <el-select v-model="ruleForm.selfSupport" placeholder="请选择">
                        <el-option
                          v-for="item in const_awOwn"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        ></el-option>
                      </el-select>
                    </div>
                  </el-form-item>
                </div>
                <div class="addHouse-user-input-list">
                  <div class="user-input-title"><div class="user-input-sure">*</div>项目名称：</div>
                  <el-form-item prop="objectName">
                    <div class="user-input">
                      <el-input v-model="ruleForm.objectName" placeholder="请输入项目名称"></el-input>
                    </div>
                  </el-form-item>
                </div>
              </div>

              <div class="addHouse-user-input">
                <div class="addHouse-user-input-list">
                  <div class="user-input-title"><div class="user-input-sure">*</div>均价：</div>
                  <el-form-item prop="averagePrice">
                    <div class="user-input1">
                      <el-input type="number" min="0" v-model="ruleForm.averagePrice" placeholder="请输入内容" ></el-input>
                    </div>
                  </el-form-item>
                  <el-form-item prop="priceUnit">
                    <el-select class="addview-view-input-margin-left" v-model="ruleForm.priceUnit" placeholder="请选择">
                      <el-option
                              v-for="item in const_priceUnit"
                              :key="item.value"
                              :label="item.label"
                              :value="item.value"
                      ></el-option>
                    </el-select>
                  </el-form-item>
                </div>
                <div class="addHouse-user-input-list">
                  <div class="user-input-title"><div class="user-input-sure">*</div>楼盘别名：</div>
                  <el-form-item prop="alias">
                    <div class="user-input">
                      <el-input v-model="ruleForm.alias" placeholder="请输入内容"></el-input>
                    </div>
                  </el-form-item>
                </div>
              </div>
              <div class="addHouse-user-input">
                <div class="addHouse-user-input-list1">
                  <div class="user-input-title"><div class="user-input-sure">*</div>所在地址：</div>
                  <div class="cotent-botton-input">
                    <el-form-item prop="province">
                      <el-select v-model="ruleForm.province"  @change="getprovince" value-key="id" clearable placeholder="省">
                        <el-option
                                v-for="item in citylist"
                                :key="item.id"
                                :label="item.name"
                                :value="item">
                        </el-option>
                      </el-select>
                    </el-form-item>
                  </div>
                  <div class="cotent-botton-input addview-view-input-margin-left">
                    <el-form-item prop="city">
                      <el-select v-model="ruleForm.city" @change="getcitymsg" value-key="id"  clearable placeholder="市">
                        <el-option
                                v-for="item in citylist1"
                                :key="item.id"
                                :label="item.name"
                                :value="item">
                        </el-option>
                      </el-select>
                    </el-form-item>
                  </div>
                  <div class="cotent-botton-input addview-view-input-margin-left">
                    <el-form-item prop="county">
                      <el-select v-model="ruleForm.county" value-key="id" clearable placeholder="区/县">
                        <el-option
                                v-for="item in citylist2"
                                :key="item.id"
                                :label="item.name"
                                :value="item">
                        </el-option>
                      </el-select>
                    </el-form-item>
                  </div>
                  <div class="user-input1">
                    <el-form-item prop="address">
                      <el-input v-model="ruleForm.address" placeholder="请输入内容"></el-input>
                    </el-form-item>
                  </div>
                    <el-button class="user-input-text" style="height: 36px" type="primary" @click="openMap">标记位置</el-button>
                </div>
              </div>

              <div class="addHouse-user-input">
                <div class="addHouse-user-input-list">
                  <div class="user-input-title">折扣：</div>
                  <div class="user-input">
                    <el-form-item prop="sale">
                      <el-input v-model="ruleForm.sale" placeholder="请输入内容"></el-input>
                    </el-form-item>

                  </div>
                </div>
                <div class="addHouse-user-input-list">
                  <div class="user-input-title"><div class="user-input-sure">*</div>销售状态：</div>
                  <div class="user-input">
                    <el-form-item prop="saleStatus">
                      <el-select v-model="ruleForm.saleStatus" placeholder="请选择">
                        <el-option
                          v-for="item in const_projectStatu"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        ></el-option>
                      </el-select>
                    </el-form-item>
                  </div>
                </div>
              </div>
              <div class="addHouse-user-input">
                <div class="addHouse-user-input-list">
                  <div class="user-input-title">开盘时间：</div>
                  <div class="user-input">
                    <el-form-item prop="openTime">
                      <el-input v-model="ruleForm.openTime" placeholder="请输入内容"></el-input>
                    </el-form-item>
                  </div>
                </div>
                <div class="addHouse-user-input-list">
                  <div class="user-input-title"><div class="user-input-sure">*</div>预计交房：</div>
                  <div class="user-input">
                    <el-form-item prop="expectedOthers">
                      <el-input v-model="ruleForm.expectedOthers" placeholder="请输入内容"></el-input>
                    </el-form-item>
                  </div>
                </div>
              </div>
              <div class="addHouse-user-input">
                <div class="addHouse-user-input-list">
                  <div class="user-input-title">装修状况：</div>
                  <div class="user-input">
                    <el-form-item prop="decorateStatus">
                      <el-select v-model="ruleForm.decorateStatus" placeholder="请选择">
                        <el-option
                          v-for="item in const_decorateStatus"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        ></el-option>
                      </el-select>
                    </el-form-item>
                  </div>
                </div>
                <div class="addHouse-user-input-list">
                  <div class="user-input-title">建筑面积：</div>
                  <div class="user-input2">
                    <el-form-item prop="buildArea">
                      <el-input v-model="ruleForm.buildArea" type="number" min="0" placeholder="请输入内容"></el-input>
                    </el-form-item>
                  </div>
                  <div class="addHouse-user-company">㎡</div>
                </div>
              </div>
              <div class="addHouse-user-input">
                <div class="addHouse-user-input-list">
                  <div class="user-input-title">占地面积：</div>
                  <div class="user-input2">
                    <el-form-item prop="coverArea">
                      <el-input v-model="ruleForm.coverArea" type="number" min="0" placeholder="请输入内容"></el-input>
                    </el-form-item>
                  </div>
                  <div class="addHouse-user-company">㎡</div>
                </div>
                <div class="addHouse-user-input-list">
                  <div class="user-input-title">规划户数：</div>
                  <div class="user-input2">
                    <el-form-item prop="householdNum">
                      <el-input v-model="ruleForm.householdNum" type="number" min="0" placeholder="请输入内容"></el-input>
                    </el-form-item>
                  </div>
                  <div class="addHouse-user-company">户</div>
                </div>
              </div>
              <div class="addHouse-user-input">
                <div class="addHouse-user-input-list">
                  <div class="user-input-title">绿化率：</div>
                  <div class="user-input2">
                    <el-form-item prop="greenRate">
                      <el-input v-model="ruleForm.greenRate" type="number" min="0" placeholder="请输入内容"></el-input>
                    </el-form-item>
                  </div>
                  <div class="addHouse-user-company">%</div>
                </div>
                <div class="addHouse-user-input-list">
                  <div class="user-input-title">容积率：</div>
                  <div class="user-input2">
                    <el-form-item prop="plotRate">
                      <el-input v-model="ruleForm.plotRate" type="number" min="0" placeholder="请输入内容"></el-input>
                    </el-form-item>
                  </div>
                </div>

              </div>
              <div class="addHouse-user-input">
                <div class="addHouse-user-input-list">
                  <div class="user-input-title">产权：</div>
                  <div class="user-input2">
                    <el-form-item prop="propertyYears">
                      <el-input v-model="ruleForm.propertyYears" type="number" min="0" placeholder="请输入内容"></el-input>
                    </el-form-item>
                  </div>
                  <div class="addHouse-user-company">年</div>
                </div>
                <div class="addHouse-user-input-list">
                  <div class="user-input-title">规划车位：</div>
                  <div class="user-input2">
                    <el-form-item prop="carNum">
                      <el-input type="number" min="0" v-model="ruleForm.carNum" placeholder="请输入内容"></el-input>
                    </el-form-item>
                  </div>
                  <div class="addHouse-user-company">个</div>
                </div>
              </div>
              <div class="addHouse-user-input">
                <div class="addHouse-user-input-list">
                  <div class="user-input-title">建筑类别：</div>
                  <div class="user-input">
                    <el-form-item prop="architecturalStyle">
                        <el-select v-model="ruleForm.architecturalStyle" placeholder="请选择">
                          <el-option
                            v-for="item in const_architecturalStyle"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value"
                          ></el-option>
                        </el-select>
                    </el-form-item>
                  </div>
                </div>
                <div class="addHouse-user-input-list">
                  <div class="user-input-title">供暖方式：</div>
                  <div class="user-input">
                    <el-form-item prop="heatingMethod">
                      <el-select v-model="ruleForm.heatingMethod" placeholder="请选择">
                        <el-option
                          v-for="item in const_heatingMethod"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        ></el-option>
                      </el-select>
                    </el-form-item>
                  </div>
                </div>
              </div>
              <div class="addHouse-user-input">
                <div class="addHouse-user-input-list">
                  <div class="user-input-title">供水方式：</div>
                  <div class="user-input">
                    <el-form-item prop="waterType">
                      <el-select v-model="ruleForm.waterType" placeholder="请选择">
                        <el-option
                          v-for="item in const_waterType"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        ></el-option>
                      </el-select>
                    </el-form-item>
                  </div>
                </div>
                <div class="addHouse-user-input-list">
                  <div class="user-input-title">供电方式：</div>
                  <div class="user-input">
                    <el-form-item prop="electricType">
                      <el-select v-model="ruleForm.electricType" placeholder="请选择">
                        <el-option
                          v-for="item in const_electricType"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        ></el-option>
                      </el-select>
                    </el-form-item>
                  </div>
                </div>
              </div>
              <div class="addHouse-user-input">
                <div class="addHouse-user-input-list">
                  <div class="user-input-title"><div class="user-input-sure">*</div>开发商：</div>
                  <div class="user-input">
                    <el-form-item prop="developer">
                      <el-input v-model="ruleForm.developer" placeholder="请输入内容"></el-input>
                    </el-form-item>
                  </div>
                </div>
                <div class="addHouse-user-input-list">
                  <div class="user-input-title">物业公司：</div>
                  <div class="user-input">
                    <el-form-item prop="management">
                      <el-input v-model="ruleForm.management" placeholder="请输入内容"></el-input>
                    </el-form-item>
                  </div>
                </div>
              </div>
              <div class="addHouse-user-input">
                <div class="addHouse-user-input-list1">
                  <div class="user-input-title"><div class="user-input-sure">*</div>物业类型：</div>
                  <div>
                    <el-form-item prop="houseUse">
                      <el-checkbox-group  v-model="ruleForm.houseUse">
                        <el-checkbox v-for="(item,index) in const_houseUse"
                                     :key="index"
                                     class="user-input-radio"
                                     :label="item.value"
                                    >{{item.label}}</el-checkbox>
                      </el-checkbox-group>
                    </el-form-item>
                  </div>
                </div>
              </div>
              <div class="addHouse-user-input">
                <div class="addHouse-user-input-list">
                  <div class="user-input-title">物业费：</div>
                  <div class="user-input">
                    <el-form-item prop="managementPrice">
                      <el-input
                        v-model="ruleForm.managementPrice"
                        type="number"
                        min="0"
                        placeholder="请输入内容"
                      ></el-input>
                    </el-form-item>
                  </div>
                  <div class="addHouse-user-company">元/㎡/月</div>
                </div>
                <div class="addHouse-user-input-list">
                  <div class="user-input-title">售楼处地址：</div>
                  <div class="user-input">
                    <el-form-item prop="salesAddress">
                      <el-input v-model="ruleForm.salesAddress" placeholder="请输入内容"></el-input>
                    </el-form-item>
                  </div>
                </div>
              </div>
              <div class="addHouse-user-input">
                <div class="addHouse-user-input-list1">
                  <div class="user-input-title"><div class="user-input-sure">*</div>项目标签：</div>
                  <div>
                    <el-form-item prop="projectTag">
                      <el-checkbox-group v-model="ruleForm.projectTag">
                        <el-checkbox  v-for="(item,index) in const_projectTag"
                                      :key="index"
                                      class="user-input-radio"
                                      :label="item.value"
                        >{{item.label}}</el-checkbox>
                      </el-checkbox-group>
                    </el-form-item>
                  </div>
                </div>
              </div>
              <div class="addHouse-user-input">
                <div class="addHouse-user-input-list1">
                  <div class="user-input-title">项目简介：</div>
                  <div class="user-input-textarea">
                    <el-form-item prop="objectSynopsis">
                      <el-input
                        type="textarea"
                        :rows="4"
                        placeholder="请输入内容"
                        v-model="ruleForm.objectSynopsis"
                      ></el-input>
                    </el-form-item>
                  </div>
                </div>
              </div>
              <div class="addHouse-user-addview">
                <div class="addHouse-addview-title">
                  <div class="left-title">预售许可证：</div>
                  <div class="button" @click="addDomain">添加许可证</div>
                </div>
                <div ref="addHouseAddview">
                  <div
                    class="addHouse-addview-view"
                    label-width="100%"
                    v-for="(item, index) in ruleForm.linkerLicences"
                    :key="item.key"
                  >
                    <div class="addHouse-addview-view-colos" @click.prevent="removeDomain(item)">
                      <i class="el-icon-circle-close"></i>
                    </div>
                    <div class="addHouse-addview-view-input">
                      <div>
                        <el-upload
                          :action="importFileUrlInfo"
                          :headers="headersMsg"
                          class="addHouse-addview-view-input-upload"
                          list-type="picture-card"
                          :on-preview="handlePictureCardPreview"
                          :on-remove="handleRemove"
                          :on-success="groupLinkerLicences"
                        >
                          <i class="el-icon-plus"></i>
                        </el-upload>
                        <el-dialog :visible.sync="dialogVisible">
                          <img width="100%" :src="dialogImageUrl" alt>
                        </el-dialog>
                        <div class="addHouse-addview-view-input-text">上传预售许可证</div>
                      </div>
                      <div class="addview-view-input">
                        <div class="addview-view-input-list">
                          <div class="addview-view-input-list-titel">预售许可证：</div>
                          <div class="addview-view-input-list-input">
                            <el-form-item :prop="'linkerLicences.'+index+'.licence'" :rules="{
      required: true, message: '预售许可证不能为空', trigger: 'blur'
    }">
                              <el-input
                                v-model="ruleForm.linkerLicences[index].licence"
                                
                                placeholder="请输入内容"
                              ></el-input>
                            </el-form-item>
                          </div>
                        </div>
                        <div class="addview-view-input-list">
                          <div class="addview-view-input-list-titel">发证时间：</div>
                          <div class="addview-view-input-list-input">
                            <el-form-item :prop="'linkerLicences.'+index+'.certificateTime'">
                              <el-date-picker
                                v-model="ruleForm.linkerLicences[index].certificateTime"
                                type="date"
                                placeholder="选择日期"
                              ></el-date-picker>
                            </el-form-item>
                          </div>
                        </div>
                      </div>
                      <div class="addview-view-input">
                        <div class="addview-view-input-list">
                          <div class="addview-view-input-list-titel">绑定楼栋：</div>
                          <div class="addview-view-input-list-input">
                            <el-form-item :prop="'linkerLicences.'+index+'.bindingBuilding'">
                              <el-input
                                v-model="ruleForm.linkerLicences[index].bindingBuilding"
                                placeholder="请输入内容"
                              ></el-input>
                            </el-form-item>
                          </div>
                        </div>
                      </div>
                      <div></div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="addHouse-user-addview">
                <div class="addHouse-addview-title">
                  <div class="left-title">楼栋信息：</div>
                  <div class="button" @click="addHouse">添加楼栋信息</div>
                </div>
                <div ref="AddviewHouse">
                  <div
                    class="addHouse-addview-view"
                    label-width="100%"
                    v-for="(item, index) in ruleForm.fyBuildingInfos"
                    :key="item.key"
                  >
                    <div class="addHouse-addview-view-colos" @click.prevent="removeHouse(item)">
                      <i class="el-icon-circle-close"></i>
                    </div>
                    <div class="addHouse-addview-view-input">
                      <div>
                        <el-upload
                          class="addHouse-addview-view-input-upload"
                          :action="importFileUrlInfo"
                          :headers="headersMsg"
                          list-type="picture-card"
                          :on-preview="handlePictureCardPreview"
                          :on-remove="handleRemove"
                        >
                          <i class="el-icon-plus"></i>
                        </el-upload>
                        <el-dialog :visible.sync="dialogVisible">
                          <img width="100%" :src="dialogImageUrl" alt>
                        </el-dialog>
                        <div class="addHouse-addview-view-input-text">上传楼栋分布图</div>
                      </div>
                      <div class="addview-view-input">
                        <div class="addview-view-input-list">
                          <div class="addview-view-input-list-titel">楼栋名称：</div>
                          <div class="addview-view-input-list-input">
                            <el-form-item :prop="'fyBuildingInfos.'+index+'.buildingName'"  :rules="{
      required: true, message: '预售许可证不能为空', trigger: 'blur'
    }">
                              <el-input v-model="ruleForm.fyBuildingInfos[index].buildingName" placeholder="请输入内容"></el-input>
                            </el-form-item>
                          </div>
                        </div>
                        <div class="addview-view-input-list">
                          <div class="addview-view-input-list-titel">开盘时间：</div>
                          <div class="addview-view-input-list-input">
                            <el-form-item :prop="'fyBuildingInfos.'+index+'.bdOpenTime'">
                              <el-input
                                v-model="ruleForm.fyBuildingInfos[index].bdOpenTime"
                                placeholder="选择日期"
                              ></el-input>
                            </el-form-item>
                          </div>
                        </div>
                        <div class="addview-view-input-list">
                          <div class="addview-view-input-list-titel">交房时间：</div>
                          <div class="addview-view-input-list-input">
                            <el-form-item :prop="'fyBuildingInfos.'+index+'.bdDeliveryTime'">
                              <el-input
                                v-model="ruleForm.fyBuildingInfos[index].bdDeliveryTime"
                                placeholder="选择日期"
                              ></el-input>
                            </el-form-item>
                          </div>
                        </div>
                        <div class="addview-view-input-list">
                          <div class="addview-view-input-list-titel">单元数量:</div>
                          <div class="addview-view-input-list-input">
                            <el-form-item :prop="'fyBuildingInfos.'+index+'.unitNum'">
                              <el-input
                                v-model="ruleForm.fyBuildingInfos[index].unitNum"
                                type="number"
                                min="0"
                                placeholder="请输入内容"
                              ></el-input>
                            </el-form-item>
                          </div>
                        </div>
                      </div>
                      <div class="addview-view-input">
                        <div class="addview-view-input-list">
                          <div class="addview-view-input-list-titel">楼层数：</div>
                          <div class="addview-view-input-list-input">
                            <el-form-item :prop="'fyBuildingInfos.'+index+'.floorNum'">
                              <el-input
                                v-model="ruleForm.fyBuildingInfos[index].floorNum"
                                type="number"
                                min="0"
                                placeholder="请输入内容"
                              ></el-input>
                            </el-form-item>
                          </div>
                        </div>
                        <div class="addview-view-input-list">
                          <div class="addview-view-input-list-titel">规划户数</div>
                          <div class="addview-view-input-list-input">
                            <el-form-item :prop="'fyBuildingInfos.'+index+'.bdHouseholdNum'">
                              <el-input
                                v-model="ruleForm.fyBuildingInfos[index].bdHouseholdNum"
                                type="number"
                                min="0"
                                placeholder="请输入内容"
                              ></el-input>
                            </el-form-item>
                          </div>
                        </div>
                        <div class="addview-view-input-list">
                          <div class="addview-view-input-list-titel">产权年限：</div>
                          <div class="addview-view-input-list-input">
                            <el-form-item :prop="'fyBuildingInfos.'+index+'.bdPropertyYears'">
                              <el-input
                                v-model="ruleForm.fyBuildingInfos[index].bdPropertyYears"
                                type="number"
                                min="0"
                                placeholder="请输入内容"
                              ></el-input>
                            </el-form-item>
                          </div>
                        </div>
                        <div class="addview-view-input-list">
                          <div class="addview-view-input-list-titel">销售状态：</div>
                          <div class="addview-view-input-list-input">
                            <el-form-item :prop="'fyBuildingInfos.'+index+'.bdSaleStatus'">
                              <el-select
                                v-model="ruleForm.fyBuildingInfos[index].bdSaleStatus"
                                placeholder="请选择"
                              >
                                <el-option
                                  v-for="item in const_projectStatu"
                                  :key="item.value"
                                  :label="item.label"
                                  :value="item.value"
                                ></el-option>
                              </el-select>
                            </el-form-item>
                          </div>
                        </div>
                      </div>

                      <div></div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="addHouse-user-addview">
                <div class="addHouse-addview-title">
                  <div class="left-title">户型信息：</div>
                  <div class="button" @click="addApartment">添加户型信息</div>
                </div>
                <div ref="AddviewApartment">
                  <div
                    class="addHouse-addview-view"
                    label-width="100%"
                    v-for="(item, index) in ruleForm.fyAttachInfos"
                    :key="item.key"
                  >
                    <div class="addHouse-addview-view-colos" @click.prevent="removeApartment(item)">
                      <i class="el-icon-circle-close"></i>
                    </div>
                    <div class="addHouse-addview-view-input">
                      <div class="addview-view-input-list-titel1">户型：</div>
                      <div class="addview-view-input-list-input1">
                        <el-form-item :prop="'fyAttachInfos.'+index+'.shi'">
                          <el-input
                            v-model="ruleForm.fyAttachInfos[index].shi"
                            type="number"
                            min="0"
                            placeholder="请输入内容"
                          ></el-input>
                        </el-form-item>
                      </div>
                      <div class="addview-view-input-list-titel2">室</div>
                      <div class="addview-view-input-list-input1">
                        <el-form-item :prop="'fyAttachInfos.'+index+'.ting'">
                          <el-input
                            v-model="ruleForm.fyAttachInfos[index].ting"
                            type="number"
                            min="0"
                            placeholder="请输入内容"
                          ></el-input>
                        </el-form-item>
                      </div>
                      <div class="addview-view-input-list-titel2">厅</div>
                      <div class="addview-view-input-list-input1">
                        <el-form-item :prop="'fyAttachInfos.'+index+'.chu'">
                          <el-input
                            v-model="ruleForm.fyAttachInfos[index].chu"
                            type="number"
                            min="0"
                            placeholder="请输入内容"
                          ></el-input>
                        </el-form-item>
                      </div>
                      <div class="addview-view-input-list-titel2">厨</div>
                      <div class="addview-view-input-list-input1">
                        <el-form-item :prop="'fyAttachInfos.'+index+'.wei'">
                          <el-input
                            v-model="ruleForm.fyAttachInfos[index].wei"
                            type="number"
                            min="0"
                            placeholder="请输入内容"
                          ></el-input>
                        </el-form-item>
                      </div>
                      <div class="addview-view-input-list-titel2">卫</div>
                    </div>
                    <div class="addHouse-addview-view-input">
                      <div class="addview-view-input">
                        <div class="addview-view-input-list">
                          <div class="addview-view-input-list-titel">建筑面积：</div>
                          <div class="addview-view-input-list-input">
                            <el-form-item :prop="'fyAttachInfos.'+index+'.area'">
                              <el-input
                                v-model="ruleForm.fyAttachInfos[index].area"
                                placeholder="请输入内容"
                              ></el-input>
                            </el-form-item>
                          </div>
                        </div>
                        <div class="addview-view-input-list">
                          <div class="addview-view-input-list-titel">总价：</div>
                          <div class="addview-view-input-list-input">
                            <el-form-item :prop="'fyAttachInfos.'+index+'.price'">
                              <el-input
                                v-model="ruleForm.fyAttachInfos[index].price"
                                placeholder="请输入内容"
                              ></el-input>
                            </el-form-item>
                          </div>
                        </div>
                      </div>
                      <div class="addview-view-input">
                        <div class="addview-view-input-list">
                          <div class="addview-view-input-list-titel">朝向</div>
                          <div class="addview-view-input-list-input">
                            <el-form-item :prop="'fyAttachInfos.'+index+'.orientations'">
                              <el-input
                                v-model="ruleForm.fyAttachInfos[index].orientations"
                                placeholder="请输入内容"
                              ></el-input>
                            </el-form-item>
                          </div>
                        </div>
                        <div class="addview-view-input-list">
                          <div class="addview-view-input-list-titel">销售状态：</div>
                          <div class="addview-view-input-list-input">
                            <el-form-item :prop="'fyAttachInfos.'+index+'.saleStatus'">
                              <el-select
                                v-model="ruleForm.fyAttachInfos[index].saleStatus"
                                placeholder="请选择"
                              >
                                <el-option
                                  v-for="item in const_projectStatu"
                                  :key="item.value"
                                  :label="item.label"
                                  :value="item.value"
                                ></el-option>
                              </el-select>
                            </el-form-item>
                          </div>
                        </div>
                      </div>

                      <div></div>
                    </div>
                    <div class="addHouse-addview-view-input marginBottom">
                      <div class="addview-view-input-list-titel1">户型图：</div>
                      <div>
                        <el-upload
                          class="addHouse-addview-view-input-upload"
                          :action="importFileUrlInfo"
                          :headers="headersMsg"
                          list-type="picture-card"
                          :on-preview="handlePictureCardPreview"
                          :on-remove="handleRemove"
                        >
                          <i class="el-icon-plus"></i>
                        </el-upload>
                        <el-dialog :visible.sync="dialogVisible">
                          <img width="100%" :src="dialogImageUrl" alt>
                        </el-dialog>
                      </div>
                      <div class="addview-view-input-list-titel3">上传户型图</div>
                      <div>
                        <el-upload
                          class="addHouse-addview-view-input-upload"
                          :action="importFileUrlInfo"
                          :headers="headersMsg"
                          list-type="picture-card"
                          :on-preview="handlePictureCardPreview"
                          :on-remove="handleRemove"
                        >
                          <i class="el-icon-plus"></i>
                        </el-upload>
                        <el-dialog :visible.sync="dialogVisible">
                          <img width="100%" :src="dialogImageUrl" alt>
                        </el-dialog>
                      </div>
                      <div class="addview-view-input-list-titel3">上传户型图全景</div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="addHouse-user-button">
                <div class="addHouse-user-button-button1" @click="getform('ruleForm',1)">下一步</div>
                <!--<div class="addHouse-user-button-button2" @click="getform('ruleForm',2)">保 存</div>-->
                <div class="addHouse-user-button-button2" @click="colosAddHouse">取消</div>
              </div>
            </el-form>
          </div>
        </el-tab-pane>
        <el-tab-pane label="楼盘相册" name="second" disabled>
          <houseAlbum @houseAlbumshow="houseAlbumshow" @colosHouseAlbum="colosAddHouse" :newLinkerId="newLinkerId"></houseAlbum>
        </el-tab-pane>
      </el-tabs>
    </div>

      <!-- 地图定位 -->
      <el-dialog custom-class="mapLocationDialog" :center="isCenter" title="地图定位" :visible.sync="dialogFormVisible" :close-on-click-modal="closeOnClickModal" :close-on-press-escape="closeOnPressEscape">

          <div class="mapSearch">
              <el-input placeholder="请输入内容" v-model="positionValue" :placeholder="mapSearchPlaceholder" class="input-with-select">
                  <el-button type="primary" @click="searchPosition" slot="append" icon="el-icon-search"><i class="el-icon-search"></i></el-button>
              </el-input>
          </div>

          <div id="mapLocation"></div>

          <div slot="footer" class="dialog-footer">
              <el-button @click="closeDialog">取 消</el-button>
              <el-button type="primary" @click="getAndSetPosition">确 定</el-button>
          </div>
      </el-dialog>

  </div>
</template>

<script>
import houseAlbum from "../common/house/houseAlbum";
import { TMap } from '../../lib/TMap'
export default {
  name: "addHouse",
  data() {
      var validatePass = (rule, value, callback) => {
          if (value<0) {
              callback(new Error('只能输入大于0的数'));
          }else if (value.length>20){
              callback(new Error('长度在20内'));
          }  else {
              callback();
          }
      };
    return {
        //是否显示地图dialog
        importFileUrlInfo:"https://sit.zooming-data.com/dist-admin/api/dist_linkerSceneFileUpload",
        headersMsg:{
            authorization:this.$store.getters.userData.token,
        },
        dialogFormVisible:false,
        closeOnClickModal:false,
        closeOnPressEscape:false,
        isCenter:false,
        positionValue: "",
        mapSearchPlaceholder: "请输入待定位包含市的地址",
        map:{}, //地图对象
        mapInfo:{},//地图信息对象
        cityLocation:{}, //城市对象
        geoCoder:{}, //定位对象
        marker:{},
        currentLocation:{},
        addressComponents:{
            country: "",
            province: "",
            city: "",
            district: "",
            street: "",
            streetNumber: "",
            town: "",
            village: ""
        },//当前定位的地址对象，地址拆分后的对象
        newLinkerId:"",
        citylist:[],
        citylist1:[],
        citylist2:[],
        showRed:false,
        const_awOwn: [
            { label: "是", value:"0"},
            { label: "否", value: "1"},
        ],
      const_projectStatu: [
        { label: "热销中", value:"0" },
        { label: "即将发售", value:"1" },
        { label: "售罄", value: "2" }
      ],
      const_decorateStatus: [
        { label: "精装", value: "0" },
        { label: "毛坯", value: "1" },
        { label: "简单装修", value: "2" },
        { label: "全装修", value: "3" },
        { label: "公共部分精装修", value: "4" }
      ],
      const_architecturalStyle: [
        { label: "塔楼", value: "0" },
        { label: "板楼", value: "1" },
        { label: "平板", value: "2" },
        { label: "塔板结合", value: "3" }
      ],
      const_heatingMethod: [
        { label: "集中供暖", value: "0" },
        { label: "自采暖", value: "1" }
      ],
      const_waterType: [
        { label: "民水", value: "0" },
        { label: "商水", value: "1" }
      ],
      const_electricType: [
        { label: "民电", value: "0" },
        { label: "商电", value: "1" }
      ],
      const_houseUse: [
        { label: "普通住宅", value: 0 },
        { label: "商住两用", value: 1 },
        { label: "商品房 ", value: 2 },
        { label: "建筑综合体", value: 3 },
        { label: "商铺", value: 4 },
        { label: "写字楼", value: 5 },
        { label: "别墅", value: 6 },
        { label: "公寓", value: 7 },
        { label: "洋房", value: 8 },
        { label: "酒店", value: 9 }
      ],
      const_projectTag: [
        { label: "教育地产", value: 0 },
        { label: "品牌开发商", value: 1 },
        { label: "豪华社区 ", value: 2 },
        { label: "低总价", value: 3 },
        { label: "刚需房", value: 4 }
      ],
        const_priceUnit:[
            { label: "元/m2", value: 1 },
            { label: "万元/套起", value: 2 },
        ],
      ruleForm: {
              selfSupport: "",
              objectName: "",
              objectSynopsis: "",
              alias: "",
              province:"",
              city:"",
              county:"",
              address: "",
              averagePrice: 0,
              priceUnit:"",//单位价格
              sale: "",
              saleStatus:"",
              openTime: "",
              expectedOthers: "",
              decorateStatus: "",
              buildArea: 0,
              coverArea: 0,
              householdNum: 0,
              greenRate: 0,
              plotRate: 0,
              propertyYears: 0,
              carNum: 0,
              architecturalStyle:"",
              heatingMethod: "",
              waterType: "",
              electricType: "",
              developer: "",
              houseUse: [],
              management: "",
              managementPrice: 0,
              salesAddress: "",
              projectTag: [],
        linkerLicences: [],
        fyBuildingInfos: [],
        fyAttachInfos: []
      },
      rules: {
          selfSupport: [
              { required: true, message: '请选择尊豪自营', trigger: 'change' }
          ],
        objectName: [
            { required: true, message: "请输入活动名称", trigger: "blur" },
            { min: 1, max: 20, message: '长度在 1到 20个字符', trigger: 'blur' }
        ],
          province: [
              {type: 'object', required: true, message: '请选择省', trigger: 'change' }
          ],
          city: [
              {type: 'object', required: true, message: '请选择市', trigger: 'change' }
          ],
          county: [
              { type: 'object',required: true, message: '请选择区/县', trigger: 'change' }
          ],
          address:[
              { required: true, message: "请输入地址", trigger: "blur" },
              { min: 1, max: 50, message: '长度在 1到 50个字符', trigger: 'blur' }
          ],
          expectedOthers:[
              { required: true, message: '请选择时间', trigger: 'change' },
              { min: 1, max: 30, message: '长度在 1到 30个字符', trigger: 'blur' }
          ],
          averagePrice: [
              { required: true, message: "请输入均价", trigger: "blur" },
              { min: 1, max: 20, message: '长度在 1到 20个字符', trigger: 'blur' },
              { validator: validatePass, trigger: 'blur' }
          ],
          priceUnit:[
              {type: 'number', required: true, message: '请选择单位', trigger: 'change' }
          ],
          alias:[
              { required: true, message: "请输入楼盘别名", trigger: "blur" },
              { min: 1, max: 20, message: '长度在 1到 20个字符', trigger: 'blur' }
          ],
          saleStatus:[
              { required: true, message: "请选择销售状态", trigger: 'change' },
          ],
          developer:[
              { required: true, message: "请输入开发商", trigger: "blur" },
              { min: 1, max: 30, message: '长度在 1到 30个字符', trigger: 'blur' }
          ],
          houseUse:[
              { type: 'array', required: true, message: '请至少选择一个物业类型', trigger: 'change' }
          ],
          projectTag:[
              { type: 'array', required: true, message: '请至少选择一个项目标签', trigger: 'change' }
          ],
          objectSynopsis:[
              { required: false,min:0,  max: 50, message: '长度在50个字符内', trigger: 'blur' }
          ],
          sale:[
              { required: false, min:0, max: 11, message: '长度在11个字符内', trigger: 'blur' }
          ],
          openTime:[
              { required: false,min:0,  max: 30, message: '长度在30内', trigger: 'blur' },
          ],
          buildArea:[
              {required: false, validator: validatePass, trigger: 'blur' },
          ],
          coverArea:[
              {required: false, validator: validatePass, trigger: 'blur' },
          ],
          householdNum:[
              {required: false,  validator: validatePass, trigger: 'blur' }
          ],
          greenRate:[
              {required: false,  validator: validatePass, trigger: 'blur' }
          ],
          plotRate:[
              { required: false, validator: validatePass, trigger: 'blur' }
          ],
          propertyYears:[
              {required: false,  validator: validatePass, trigger: 'blur' }
          ],
          carNum:[
              { required: false, validator: validatePass, trigger: 'blur' }
          ],
          managementPrice:[
            { required: false, validator: validatePass, trigger: 'blur' }
        ],
      },

      name: "",
      activeName2: "first",
      dialogImageUrl: "",
      dialogVisible: false,
      input: "",
      radio: "1",
      textarea: "",
      rightButtonId:"",
      fyInfoId:"",
      value: ""
    };
  },

  components: {
    houseAlbum
  },

  mounted() {
      this.getcity()
      if(this.$route.query.type=="edit"){
          this.getHouseMsg()
      }else {

      }

  },
  methods: {
      //上传代码
      groupLinkerLicences(response, file, fileList){
          this.groupLinkerLicencesInfo=response.data
          console.log(response, file, fileList,"相册相册")
      },

      //=================  地图位置标记开始 ===================//
      //打开地图定位
      openMap() {
          let _this = this;
          _this.dialogFormVisible = true;
          //初始化地图
          TMap().then(qq => {

              //创建地图
              _this.map = new qq.maps.Map(document.getElementById("mapLocation"), {
                  //地图的中心地理坐标。
                  center: new qq.maps.LatLng(39.916527, 116.397128),
                  //地图放大大小
                  zoom: 15
              });

              //创建地图信息窗口
              _this.mapInfo = new qq.maps.InfoWindow({map: _this.map});

              //新增地址解析类
              _this.geoCoder = new qq.maps.Geocoder({
                  complete : function(result){
                      //获取当前定位地址
                      _this.positionValue = result.detail.address;
                      _this.addressComponents = result.detail.addressComponents;
                      _this.currentLocation = result.detail.location;
                      _this.map.setCenter(result.detail.location);

                      //设置标记，不存在再创建，否则再拖动标记时会出现多个标记的情况
                      if (!_this.marker.position) {
                          _this.marker = new qq.maps.Marker({
                              map:_this.map,
                              draggable:true,
                              visible:true,
                              animation: qq.maps.MarkerAnimation.DOWN,
                              position: result.detail.location
                          });

                          //标记停止拖动后重新定位
                          new qq.maps.event.addListener(_this.marker, 'dragend', function() {
                              _this.mapInfo.setPosition(_this.marker.getPosition());
                              _this.geoCoder.getAddress(_this.marker.getPosition());
                          });

                          //添加监听事件 当鼠标移入标记区域显示图层
                          new qq.maps.event.addListener(_this.marker, 'mouseover', function() {
                              _this.mapInfo.open();
                              _this.mapInfo.setContent('<div style="width:280px;height:60px;">'+ _this.positionValue + '</div>');
                              _this.mapInfo.setPosition(_this.currentLocation);
                          });

                          //添加监听事件 当鼠标移出标记区域关闭图层
                          new qq.maps.event.addListener(_this.marker, 'mouseout', function() {
                              _this.mapInfo.close();
                          });
                      } else{
                          _this.marker.setPosition(result.detail.location)
                      }
                  }
              });

              if (this.positionValue) {
                  _this.searchPosition();
              } else {
                  //默认根据当前浏览器的ip获取到所在城市对象
                  _this.cityLocation = new qq.maps.CityService({
                      complete : function(result){
                          _this.geoCoder.getAddress(result.detail.latLng);
                      }
                  });

                  //调用searchLocalCity()方法 根据用户IP查询城市信息。
                  _this.cityLocation.searchLocalCity();
              }

          });
      },

      /**
       * 根据输入值在地图上进行定位
       */
      searchPosition() {
          if (!this.positionValue) {
              this.$alert("请输入至少包含到市的待定位地址再搜索！")
              return;
          }
          this.geoCoder.getLocation(this.positionValue);
      },

      /**
       * 获取当前定位地址并回填到父组件中
       */
      getAndSetPosition(){
          if (this.addressComponents.streetNumber) {
              this.ruleForm.address = this.addressComponents.streetNumber;
          } else if(this.addressComponents.street){
              this.ruleForm.address = this.addressComponents.street;
          }
          this.marker = {};
          document.getElementById("mapLocation").innerHTML = "";
          this.dialogFormVisible = false;
      },

      closeDialog(){
          //标记对象置空，否则会因为已存在改标记对象但又与新创建的地图不匹配不展示
          this.marker = {};
          document.getElementById("mapLocation").innerHTML = "";
          this.dialogFormVisible = false;
      },
      //=================  地图位置标记结束 ===================//

      //获取楼盘详情
      getHouseMsg(){
          let _this = this;
          let params={
              id:this.$route.query.linkerId,
          }
          _this.Api.setting.distSeeNewHouse(params).then((data)=>{
              this.ruleForm = data.data.fyInfo
              this.linkerLicences=data.data.linkerLicences
              this.fyBuildingInfos=data.data.fyBuildingInfos
              this.fyAttachInfos=data.data.fyAttachInfos
              console.log("00000000000000000000000000,谁谁谁",data)
          })
      },
      houseAlbumshow(){
          this.activeName2="first"
      },
      //保存并进行下一步
    getform(formName,step) {
        let _this = this;
        let prems = {
            linkerObject:{
                selfSupport: this.ruleForm.selfSupport,
                    objectName:this.ruleForm.objectName,
                    objectSynopsis:this.ruleForm.objectSynopsis,
                    alias:this.ruleForm.alias,
                    province:this.ruleForm.province.name,
                    city:this.ruleForm.city.name,
                    county:this.ruleForm.county.name,
                    address:this.ruleForm.address,
            },
            fyInfo:{
                averagePrice:this.ruleForm.averagePrice,
                    priceUnit:this.ruleForm.priceUnit,//单位价格
                    sale:this.ruleForm.sale,
                    saleStatus:this.ruleForm.saleStatus,
                    openTime: this.ruleForm.openTime,
                    expectedOthers:this.ruleForm.expectedOthers,
                    decorateStatus:this.ruleForm.decorateStatus,
                    buildArea:this.ruleForm.buildArea,
                    coverArea:this.ruleForm.coverArea,
                    householdNum:this.ruleForm.householdNum,
                    greenRate:this.ruleForm.greenRate,
                    plotRate:this.ruleForm.plotRate,
                    propertyYears:this.ruleForm.propertyYears,
                    carNum:this.ruleForm.carNum,
                    architecturalStyle:this.ruleForm.architecturalStyle,
                    heatingMethod: this.ruleForm.heatingMethod,
                    waterType:this.ruleForm.waterType,
                    electricType: this.ruleForm.electricType,
                    developer: this.ruleForm.developer,
                    houseUse: this.ruleForm.houseUse.join(","),
                    management:this.ruleForm.management,
                    managementPrice: this.ruleForm.managementPrice,
                    salesAddress:this.ruleForm.salesAddress,
                    projectTag: this.ruleForm.projectTag.join(","),
            },
            linkerLicences: this.ruleForm.linkerLicences,
            fyBuildingInfos: this.ruleForm.fyBuildingInfos,
            fyAttachInfos: this.ruleForm.fyAttachInfos,
        };
        let prems1 = {
            id:this.newLinkerId,
            rightButtonId:this.rightButtonId,
            fyInfoId:this.fyInfoId,
            linkerObject:{
                selfSupport: this.ruleForm.selfSupport,
                objectName:this.ruleForm.objectName,
                objectSynopsis:this.ruleForm.objectSynopsis,
                alias:this.ruleForm.alias,
                province:this.ruleForm.province.name,
                city:this.ruleForm.city.name,
                county:this.ruleForm.county.name,
                address:this.ruleForm.address,
            },
            fyInfo:{
                averagePrice:this.ruleForm.averagePrice,
                priceUnit:this.ruleForm.priceUnit,//单位价格
                sale:this.ruleForm.sale,
                saleStatus:this.ruleForm.saleStatus,
                openTime: this.ruleForm.openTime,
                expectedOthers:this.ruleForm.expectedOthers,
                decorateStatus:this.ruleForm.decorateStatus,
                buildArea:this.ruleForm.buildArea,
                coverArea:this.ruleForm.coverArea,
                householdNum:this.ruleForm.householdNum,
                greenRate:this.ruleForm.greenRate,
                plotRate:this.ruleForm.plotRate,
                propertyYears:this.ruleForm.propertyYears,
                carNum:this.ruleForm.carNum,
                architecturalStyle:this.ruleForm.architecturalStyle,
                heatingMethod: this.ruleForm.heatingMethod,
                waterType:this.ruleForm.waterType,
                electricType: this.ruleForm.electricType,
                developer: this.ruleForm.developer,
                houseUse: this.ruleForm.houseUse.join(","),
                management:this.ruleForm.management,
                managementPrice: this.ruleForm.managementPrice,
                salesAddress:this.ruleForm.salesAddress,
                projectTag: this.ruleForm.projectTag.join(","),
            },
            linkerLicences: this.ruleForm.linkerLicences,
            fyBuildingInfos: this.ruleForm.fyBuildingInfos,
            fyAttachInfos: this.ruleForm.fyAttachInfos,
        };
      console.log(this.$refs[formName].fields);
      var isAllPass = this.$refs[formName].fields.every(item => {
        return item.validateState == "success" || item.validateState == "";
      });
      this.$refs[formName].validate(valid => {
        if (valid) {
            if( this.newLinkerId){
                _this.Api.setting.distEditNewHouses(prems1).then((data)=>{
                    if(data.returnCode==10000){
                        this.$message({
                            type: 'success',
                            message: '新增楼盘成功!'
                        });
                        this.newLinkerId=data.data.linkerId
                        if(step==1){
                            this.activeName2="second"
                        }else {

                        }
                    }else {
                        this.$message({
                            type: 'warning',
                            message:data.msg
                        });
                    }

                })
            }else {
                _this.Api.setting.distAddNewHouses(prems).then((data)=>{
                    if(data.returnCode==10000){
                        this.$message({
                            type: 'success',
                            message: '新增楼盘成功!'
                        });
                        this.newLinkerId=data.data.linkerId
                        this.rightButtonId=data.data.linkerRightButtonId
                        this.fyInfoId=data.data.fyInfoId
                        if(step==1){
                            this.activeName2="second"
                        }else {

                        }
                    }else {
                        this.$message({
                            type: 'warning',
                            message:data.msg
                        });
                    }

                })
            }

        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
      getcity(){
          let _this = this;
          let params={
              pid:0,
          }
          _this.Api.setting.cityList(params).then((data)=>{
              console.log("kkkkkkkkkkkkkkkkkkk",data)
              _this.citylist=data.data;
          })
      },
      //查看省
      getprovince(event){
          this.ruleForm.city=""
          this.ruleForm.county=""
          this.citylist2=[]
          if(event){
              let _this = this;
              let params={
                  pid:event.id,
              }
              _this.Api.setting.cityList(params).then((data)=>{
                  console.log("kkkkkkkkkkkkkkkkkkk",data)
                  _this.citylist1=data.data;
              })
          }
          console.log("省省省省省省省省省省省省省省省省省省",event)
      },
      getcitymsg(event){
          this.ruleForm.county=""
          if(event){
              let _this = this;
              let params={
                  pid:event.id,
              }
              _this.Api.setting.cityList(params).then((data)=>{
                  console.log("kkkkkkkkkkkkkkkkkkk",data)
                  _this.citylist2=data.data;
              })
          }
          console.log("事实上司",event)
      },
    //表单提交前的预处理
    submitHandler(formdata){
        formdata.map
        return {}
    },
    colosAddHouse() {
        this.$router.push({path: './houseManage'});
    },
    handleClick(tab, event) {
      console.log(tab, event,"asasasasas");
    },
    removeDomain(item) {
      var index = this.ruleForm.linkerLicences.indexOf(item);
      if (index !== -1) {
        this.ruleForm.linkerLicences.splice(index, 1);
      }
    },
    addDomain() {
      this.ruleForm.linkerLicences.push({
        key: Date.now()
      });
    },
    removeHouse(item) {
      var index = this.ruleForm.fyBuildingInfos.indexOf(item);
      if (index !== -1) {
        this.ruleForm.fyBuildingInfos.splice(index, 1);
      }
    },
    addHouse() {
      this.ruleForm.fyBuildingInfos.push({
        key: Date.now()
      });
    },
    removeApartment(item) {
      var index = this.ruleForm.fyAttachInfos.indexOf(item);
      if (index !== -1) {
        this.ruleForm.fyAttachInfos.splice(index, 1);
      }
    },
    addApartment() {
      this.ruleForm.fyAttachInfos.push({
        key: Date.now()
      });
    },
    handleRemove(file, fileList) {
      console.log(file, fileList);
    },
    handlePictureCardPreview(file) {
      this.dialogImageUrl = file.url;
      this.dialogVisible = true;
    }
  }
};
</script>

<style>
  .addHouse-view .el-upload-list--picture-card .el-upload-list__item{
    width: 78px;
    height: 78px;
  }
  .addHouse-view .el-button{
    border: none;
    margin: 0px;
    padding: 0px;
  }
  .addHouse-view.el-dialog--small {
    width:517px;
  }
  .addHouse-view .el-form-item__label {
    text-align: right;
    vertical-align: middle;
    float: left;
    font-size: 14px;
    font-family:PingFangSC-Regular;
    font-weight:400;
    color:rgba(0,0,0,0.85);
    line-height:22px;
    padding: 7px 0px 0px 30px;
    box-sizing: border-box;
  }
  .addHouse-view  .el-dialog__header{
    height: 50px;
    padding: 10px ;
    text-align: left;
    font-size:16px;
    font-family:PingFangSC-Medium;
    font-weight:500;
    color:rgba(0,0,0,0.85);
    line-height:24px;

  }
  .addHouse-view .el-dialog__body{
    border-top: 1px #E9E9E9 solid;
    border-bottom: 1px #E9E9E9 solid;
  }
  .addHouse-view .el-form-item__content{
    /*margin-right:100px;*/
    margin-left: 0px !important;
    width: 100%;
  }
  .addHouse-view  .el-form-item{
    margin-bottom:0px
  }
.addHouse-view .el-upload--picture-card {
  width: 78px;
  height: 78px;
  line-height: 81px;
}
.addHouse-view .el-radio + .el-radio {
  margin-left: 0px;
}
.addHouse-view .el-tabs__item.is-active {
  background: rgba(26, 110, 255, 1);
  font-size: 14px;
  font-family: PingFangSC-Regular;
  font-weight: 400;
  color: rgba(255, 255, 255, 1);
}
.el-form-item__content {
  margin-left: 0px !important;
}
</style>

<style scoped rel="stylesheet/scss" lang="scss">

    .mapSearch{
        position: absolute;
        margin-left: 85px;
        margin-top: 15px;
        z-index: 999;
        width: 360px;
    }

    .input-with-select .el-input-group__prepend {
        background-color: #fff;
    }

    .mapLocationDialog{
        width: 750px;
        height: 480px;
        padding: 10px 20px;
        .dialog-footer{
            text-align: center;
        }
        #mapLocation{
            width: 920px;
            height: 422px;
        }
    }

.addHouse-view {
  margin: 24px;
  background-color: #ffffff;
  .addHouse-view-content {
    padding: 24px 32px;
    .addHouse-user {
      width: 1072px;
      .addHouse-user-addview {
        margin-bottom: 32px;
        .addHouse-addview-title {
          display: flex;
          .left-title {
            line-height: 32px;
            font-size: 14px;
            font-family: PingFangSC-Regular;
            font-weight: 400;
            color: rgba(0, 0, 0, 0.85);
          }
          .button {
            height: 32px;
            line-height: 32px;
            padding: 0px 16px;
            background: rgba(24, 144, 255, 1);
            border-radius: 4px;
            font-size: 14px;
            font-family: PingFangSC-Regular;
            font-weight: 400;
            color: rgba(255, 255, 255, 1);
          }
        }
        .addHouse-addview-view {
          width: 1072px;
          height: auto;
          background: rgba(255, 255, 255, 1);
          border-radius: 8px;
          border: 1px #d9d9d9 solid;
          margin-top: 16px;
          .addHouse-addview-view-colos {
            color: #c3c3c3;
            display: flex;
            justify-content: flex-end;
            i {
              margin: 8px 10px;
              cursor: pointer;
            }
          }
          .addHouse-addview-view-input {
            display: flex;
            .addHouse-addview-view-input-upload {
              width: 78px;
              height: 78px;
              margin-left: 34px;
              margin-bottom: 5px;
              overflow: hidden;
            }
            .addHouse-addview-view-input-text {
              font-size: 14px;
              font-family: PingFangSC-Regular;
              font-weight: 400;
              color: rgba(0, 0, 0, 0.85);
              margin-left: 24px;
            }
            .addview-view-input {
              .addview-view-input-list {
                display: flex;
                margin-bottom: 24px;
                margin-left: 15px;
                .addview-view-input-list-titel {
                  font-size: 14px;
                  font-family: PingFangSC-Regular;
                  font-weight: 400;
                  color: rgba(0, 0, 0, 0.85);
                  line-height: 32px;
                  min-width: 100px;
                  text-align: right;
                }
                .addview-view-input-list-input {
                  width: 340px;
                  height: 32px;
                  background: rgba(255, 255, 255, 1);
                  border-radius: 4px;
                }
              }
            }
          }
        }
      }
      .addHouse-user-input {
        display: flex;
        margin-bottom: 32px;
        justify-content: space-between;
        .addHouse-user-input-list1 {
          display: flex;
          width: 100%;
          line-height: 32px;
          .user-input-sure {
            font-size: 16px;
            font-family: PingFangSC-Regular;
            font-weight: 400;
            color: rgba(255, 0, 0, 0.85);
          }
          .user-input-title {
            min-width: 80px;
            font-size: 14px;
            font-family: PingFangSC-Regular;
            font-weight: 400;
            color: rgba(0, 0, 0, 0.85);
            display: flex;
            justify-content: flex-end;
          }
          .user-input {
            width: 400px;
            height: 32px;
            background: rgba(255, 255, 255, 1);
            border-radius: 4px;
          }
          .user-input1 {
            width: 400px;
            height: 32px;
            background: rgba(255, 255, 255, 1);
            border-radius: 4px;
            margin-left: 16px;
          }

          .user-input-text {
            line-height: 32px;
            border: 1px #d9d9d9 solid;
            padding: 0px 16px;
            border-radius: 4px;
            margin-left: 8px;
          }
          .user-input-radio {
            font-size: 14px;
            font-family: PingFangSC-Regular;
            font-weight: 400;
            color: rgba(0, 0, 0, 0.65);
            margin-right: 24px;
          }
          .user-input-textarea {
            width: 984px;
          }
        }
        .addHouse-user-input-list {
          display: flex;
          width: 50%;
          line-height: 32px;
          .user-input-sure {
            font-size: 16px;
            font-family: PingFangSC-Regular;
            font-weight: 400;
            color: rgba(255, 0, 0, 0.85);
          }
          .user-input-title {
            min-width: 80px;
            font-size: 14px;
            font-family: PingFangSC-Regular;
            font-weight: 400;
            color: rgba(0, 0, 0, 0.85);
            text-align: right;
            display: flex;
            justify-content: flex-end;
          }
          .user-input {
            width: 400px;
            height: 32px;
            background: rgba(255, 255, 255, 1);
            border-radius: 4px;
          }
          .user-input-radio {
            font-size: 14px;
            font-family: PingFangSC-Regular;
            font-weight: 400;
            color: rgba(0, 0, 0, 0.65);
            margin-right: 24px;
          }
        }
      }
      .addHouse-user-button {
        display: flex;
        justify-content: center;
        width: 1072px;
        margin-bottom: 20px;
        .addHouse-user-button-button1 {
          height: 32px;
          background: rgba(24, 144, 255, 1);
          border-radius: 4px;
          line-height: 32px;
          padding: 0px 16px;
          font-size: 14px;
          font-family: PingFangSC-Regular;
          font-weight: 400;
          color: rgba(255, 255, 255, 1);
          margin-right: 8px;
          cursor: pointer;
        }
        .addHouse-user-button-button2 {
          height: 32px;
          background: rgba(255, 255, 255, 1);
          border-radius: 4px;
          border: 1px #d9d9d9 solid;
          line-height: 32px;
          padding: 0px 16px;
          font-size: 14px;
          font-family: PingFangSC-Regular;
          font-weight: 400;
          color: rgba(0, 0, 0, 0.65);
          margin-right: 8px;
          cursor: pointer;
        }
      }
    }
  }
}
.user-input-option {
  width: 150px;
  height: 32px;
  background: rgba(255, 255, 255, 1);
  border-radius: 4px;
  margin-left: 8px;
}
.addview-view-input-list-input1 {
  width: 110px;
  height: 32px;
  background: rgba(255, 255, 255, 1);
  border-radius: 4px;
  margin-bottom: 24px;
}
.addview-view-input-list-titel1 {
  font-size: 14px;
  font-family: PingFangSC-Regular;
  font-weight: 400;
  color: rgba(0, 0, 0, 0.85);
  line-height: 32px;
  min-width: 100px;
  text-align: right;
  margin-left: 15px;
}
.addview-view-input-list-titel2 {
  font-size: 14px;
  font-family: PingFangSC-Regular;
  font-weight: 400;
  color: rgba(0, 0, 0, 0.85);
  line-height: 32px;
  padding: 0px 8px;
}
.addview-view-input-list-titel3 {
  font-size: 14px;
  font-family: PingFangSC-Regular;
  font-weight: 400;
  color: rgba(0, 0, 0, 0.85);
  line-height: 32px;
  align-self: center;
  padding-left: 16px;
}
.marginBottom {
  margin-bottom: 24px;
}
  .addHouse-user-company{
    font-size:14px;
    font-family:PingFangSC-Regular;
    font-weight:400;
    color:rgba(0,0,0,0.85);
    margin-left: 10px;
  }
.user-input2 {
  width:374px;
  height: 32px;
  background: rgba(255, 255, 255, 1);
  border-radius: 4px;
  margin-left: 16px;
}
.addview-view-input-margin-left{
margin-left: 10px;
  }
.cotent-botton-input{
  width:148px;
}
</style>